import 'package:flutter/material.dart'; // 导入 Flutter UI 基础库
import 'package:flutter_slidable/flutter_slidable.dart'; // 导入 flutter_slidable，用于列表滑动操作
import 'package:http/http.dart' as http; // 导入 http 库，用于网络请求
import 'dart:convert'; // 导入 dart:convert，用于 JSON 编解码

// 定义一个 StatefulWidget 页面，显示消息列表
class ListTitle extends StatefulWidget {
  const ListTitle({super.key}); // 构造函数，允许使用 key
  @override
  State<ListTitle> createState() => _ListTitleState(); // 创建页面状态
}

// 页面状态类
class _ListTitleState extends State<ListTitle> {
  List<Map<String, dynamic>> messages = []; // 消息列表数据
  bool isLoading = true; // 是否正在加载数据
  String errorMsg = ""; // 错误信息

  @override
  void initState() {
    super.initState(); // 调用父类 initState
    fetchMessages(); // 页面初始化时请求消息列表
  }

  // 异步请求后端消息数据
  Future<void> fetchMessages() async {
    final url = Uri.parse(
        "http://120.26.146.108:8080/backend/activity/list?pageNum=1&pageSize=4"); // 接口地址
    try {
      final response = await http.get(url); // 发送 GET 请求
      if (response.statusCode == 200) {
        final Map<String, dynamic> data = json.decode(response.body); // 解析 JSON
        if (data["code"] == 200) {
          final List list = data["rows"]; // 提取 rows 数组
          setState(() {
            messages = List<Map<String, dynamic>>.from(list.map((item) => {
                  "id": item["activityId"], // 活动 ID
                  "title": item["activityTitleChinaDefualt"] ?? "无标题", // 活动标题
                  "content": item["activityTitleChinaDefualt"] ?? "无内容", // 内容显示同标题
                  "time": "", // 时间字段，如果接口没有可留空
                }));
            isLoading = false; // 数据加载完成
          });
        } else {
          setState(() {
            errorMsg = "接口返回错误: ${data["msg"]}"; // 接口返回错误信息
            isLoading = false; // 加载完成
          });
        }
      } else {
        setState(() {
          errorMsg = "请求失败，状态码：${response.statusCode}"; // HTTP 请求失败
          isLoading = false; // 加载完成
        });
      }
    } catch (e) {
      setState(() {
        errorMsg = "请求异常：$e"; // 捕获请求异常
        isLoading = false; // 加载完成
      });
    }
  }




  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("消息通知"), // AppBar 标题
        centerTitle: true, // 标题居中
        backgroundColor: Colors.blue, // AppBar 背景颜色
      ),
      backgroundColor: Colors.blue, // Scaffold 页面背景颜色
      body: isLoading
          ? const Center(child: CircularProgressIndicator()) // 正在加载，显示 loading
          : errorMsg.isNotEmpty
              ? Center(
                  child: Text(errorMsg,
                      style: const TextStyle(color: Colors.white))) // 显示错误信息
              : ListView.builder(
                  itemCount: messages.length, // 列表数量
                  itemBuilder: (context, index) {
                    final message = messages[index]; // 当前消息
                    return Padding(
                      padding: const EdgeInsets.symmetric(
                          horizontal: 12, vertical: 6), // 列表项外边距
                      child: Slidable(
                        key: Key(message["id"].toString()), // 唯一 key
                        endActionPane: ActionPane(
                          motion: const StretchMotion(), // 滑动动画效果
                          children: [
                            SlidableAction(
                              onPressed: (_) {
                                ScaffoldMessenger.of(context).showSnackBar(
                                  SnackBar(
                                      content: Text("${message["title"]} 打开")), // 打开操作
                                );
                              },
                              backgroundColor: Colors.blue, // 按钮背景色
                              foregroundColor: Colors.white, // 按钮文字颜色
                              icon: Icons.open_in_new, // 按钮图标
                              label: '打开', // 按钮文字
                              borderRadius: BorderRadius.circular(12), // 按钮圆角
                            ),
                            const SizedBox(width: 6), // 按钮间距
                            SlidableAction(
                              onPressed: (_) {
                                setState(() {
                                  messages.removeAt(index); // 删除当前消息
                                });
                                ScaffoldMessenger.of(context).showSnackBar(
                                  SnackBar(
                                      content:
                                          Text("${message["title"]} 已清除")), // 删除提示
                                );
                              },
                              backgroundColor: Colors.red, // 删除按钮背景色
                              foregroundColor: Colors.white, // 删除按钮文字颜色
                              icon: Icons.delete, // 删除按钮图标
                              label: '清除', // 删除按钮文字
                              borderRadius: BorderRadius.circular(12), // 按钮圆角
                            ),
                          ],
                        ),
                        child: Container(
                          decoration: BoxDecoration(
                            color: Colors.white.withOpacity(0.2), // 半透明背景
                            borderRadius: BorderRadius.circular(12), // 列表项圆角
                            boxShadow: [
                              BoxShadow(
                                color: Colors.black.withOpacity(0.05), // 阴影颜色
                                blurRadius: 4, // 阴影模糊半径
                                offset: const Offset(0, 2), // 阴影偏移
                              ),
                            ],
                          ),
                          child: ListTile(
                            leading:
                                const Icon(Icons.message, color: Colors.white), // 左侧图标
                            title: Text(
                              message["title"] ?? "无标题", // 消息标题
                              style: const TextStyle(
                                color: Colors.white, // 标题文字颜色
                                fontWeight: FontWeight.bold, // 加粗
                              ),
                            ),
                            subtitle: Column(
                              crossAxisAlignment: CrossAxisAlignment.start, // 左对齐
                              children: [
                                Text(
                                  message["content"] ?? "无内容", // 消息内容
                                  maxLines: 2, // 最多显示两行
                                  overflow: TextOverflow.ellipsis, // 超出显示省略号
                                  style: const TextStyle(color: Colors.white70), // 文字颜色
                                ),
                                const SizedBox(height: 4), // 内容与时间间距
                                Text(
                                  message["time"] ?? "", // 时间
                                  style: const TextStyle(
                                    fontSize: 12, // 字体大小
                                    color: Colors.white54, // 颜色
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                    );
                  },
                ),
    );
  }
}
